<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-4.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<body>
<div id="header-navbar" class="top-navbar navbar-fixed-top" th:fragment="web-navbar">
    <div class="headerNav ">
        <div class="ui menu ">
            <ul class="hleft">
                <li class="logo2">
                    <span>
                        <a th:href="@{/}">
                            <img class="logo-happyoj" th:src="@{/img/logo-happyoj.png}">
                            <img class="logo-small" th:src="@{/img/logo.png}">
                            <span></span>
                        </a>
                    </span>
                </li>
                <li class=" nav_menu">
                    <a th:href="@{/problemset}" class="item item-link" >[[#{problems}]]</a>
                </li>
                <!--
                <li class=" nav_menu">
                    <a th:href="@{/problemset/status}" class="item item-dynamic-hide">[[#{status}]]</a>
                </li>-->
                <li class="t_c_contests nav_menu">
                    <a th:href="@{/contests}" class="item item-link">[[#{contests}]]</a>
                </li>
                <li class="t_c_contests nav_menu">
                    <a th:href="@{/contests/events}" class="item item-link item-dynamic-hide">[[#{recent-contest}]]</a>
                </li>
                <!--
                <li class=" nav_menu">
                    <a th:href="@{/problemset/standings}" class="item item-link item-dynamic-hide">[[#{standings}]]</a>
                </li>
                -->
                <li class="nav_menu">
                    <a th:href="@{/topics}" class="item item-link">[[#{topic}]]</a>
                </li>
                <!--
                <li class="nav_menu">
                    <a th:href="@{/tags}" class="item">[[#{tag}]]</a>
                </li>
                -->
                <li class="t_c_faq nav_menu">
                    <a th:href="@{/ide}" class="item item-link ">[[#{ide}]]</a>
                </li>
                <li class="t_c_faq nav_menu">
                    <a th:href="@{/packethub}" class="item item-link item-dynamic-hide" th:title="#{packet-analyzer}">[[#{packethub}]]</a>
                </li>
            </ul>
            <ul class="hleft item-right" th:unless="${session.session_username}">
                <li class="nav_menu">
                    <div class="profile-login">
                        <a href="/enter" class="enter item item-link">[[#{login}]]</a>
                    </div>
                </li>
            </ul>
            <ul class="hleft item-right" th:if="${session.session_username}">
                <li class="t_cprofile nav_menu">
                    <div class="profile-img">
                        <a th:href="@{/profile/{username}(username=${session.session_username})}" class="item ">
                            <img class="small-avatar" th:src="${session.session_user_avatar_url}" >
                        </a>
                    </div>
                    <ul class="t_c_box profile_box t_cprofile_box" style="display: none;">
                        <li>
                            <a class="profile-item profile-home" th:href="@{/profile/{username}(username=${session.session_username})}">[[#{profile}]]</a>
                        </li>
                        <li>
                            <a class="profile-item profile-setting" href="/settings">[[#{settings}]]</a>
                        </li>
                        <li>
                            <a class="profile-item profile-logout" href="/logout">[[#{logout}]]</a>
                        </li>
                    </ul>
                </li>
                <script type="text/javascript">
                    $(function(){
                        $(".t_cprofile").mouseover(function(){$(".t_cprofile_box").show();});
                        $(".t_cprofile").mouseout(function(){$(".t_cprofile_box").hide();});
                        $(".t_c_mail").mouseover(function(){$(".t_c_mail_box").show();});
                        $(".t_c_mail").mouseout(function(){$(".t_c_mail_box").hide();});
                    });

                    $(document).ready(function() {
                        OnlineJudge.updateMails(0);
                        OnlineJudge.ping();
                    })
                </script>
            </ul>
            <ul class="hleft navSearch item-right">
                <li class="nav_menu">
                    <div class="item ">
                        <div class="search-open">
                            <img class="search-open-img" src="/img/search_on.png">
                        </div>
                        <form method="get" action="/search" name="headSearchForm" class="search-explain" id="headSearchForm">
                            <input class="txtSearch" id="headq" name="q" type="text" th:placeholder="#{search}"/>
                        </form>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <script type="text/javascript">
        $(document).ready(function() {
            $(".search-open").click(function(){
                $(".search-open").css("display", "none");
                $(".search-explain").fadeIn(500);
                $(".txtSearch").focus();
                $(".txtSearch").blur(function(){
                    $(".search-open").css("display", "inline");
                    $(".search-explain").css("display", "none");
                });
            });
        });
    </script>
    <script th:src="@{/data/js/stat.js}"></script>
</div>
<div id="footer-link" class="footer-link" th:fragment="web-footer-link">
    <a th:href="@{/admin}">Admin</a>&nbsp;|
    <a href="https://gitee.com/jungle/online-judge/issues">[[#{issue}]]</a>&nbsp;|
    <a href="?lang=zh_CN" class="locale-zh" title="Chinese">中文</a>&nbsp;|
    <a href="?lang=en_US" class="locale-en" title="English">English</a><br>
</div>
<div id="footer-js" class="footer-js" th:fragment="web-footer-js">
    <div class="sidebar-online-users" style="text-align:left;padding: 6px;"></div>
    <link rel="stylesheet" th:href="@{/js/poshytip/tip-whitesimple/tip-whitesimple.css}" type="text/css" />
    <script type="text/javascript" th:src="@{/js/poshytip/jquery.poshytip.js}"></script>
    <script type="text/javascript" th:src="@{/js/scrolltotop.js}"></script>
    <script type="text/javascript">
        $(document).ready(function() {
            scrolltotop.offset(100,120);
            scrolltotop.init();
            OnlineJudge.saveUrl();
            //OnlineJudge.onlineUsers();
            OnlineJudge.userTip();
            OnlineJudge.tagTip();
            OnlineJudge.prettyTitle();
        });
    </script>
    <script type="text/javascript" th:inline="javascript" th:src="@{/js/role.js}"></script>
</div>
<div id="footer" th:fragment="web-footer">
    <div class="footer-desc" th:include="freemarker/footer::web-footer-desc"></div>
    <div class="footer-link" th:replace="common::web-footer-link"></div>
    <div class="footer-js" th:replace="common::web-footer-js"> </div>
</div>
<div id="footer" th:fragment="web-footer-packethub">
    <div class="footer-desc">
        <span style="color:#999999;">&copy; 2011-2024&nbsp;</span><a href="/" target="_blank"><span style="color:#999999;">weizengke</span></a><span style="color:#999999;">. powered by <a href="https://www.wireshark.org">Wireshark</a></span>
    </div>
    <div class="footer-js" th:replace="common::web-footer-js"> </div>
</div>
</body>
</html>